<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<c:set var="path" value="${pageContext.request.contextPath }"
	scope="page" />
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="renderer" content="webkit">
<link rel="stylesheet" type="text/css" href="${path}/css/ustyle.css">
<link rel="stylesheet" type="text/css" href="${path}/css/user_pager.css">
<link rel="stylesheet" type="text/css" href="${path}/css/zui.min.css">
<script type="text/javascript" src="${path}/js/zui.min.js"></script>
<script type="text/javascript" src="${path}/js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="${path}/js/musge.js"></script>


</HEAD>
<BODY>
	<!--上面的导航条-->
	<div class="note_header">
		<!--LOGO-->
		<div
			style="float: right; height: 35px; padding: 6px 20px; width: 20%;">
			<img class="header_img" src="${path}/images/user_w.png"
				id="img_fastdoor" />
			<!--hide -->
			<ul class="box_fastdoor">
				<li><a href="${path}/ShowMainPageByUser">主页</a></li>
				<li><a href="${path}/ShowBrief4BlogQuesController">广场</a></li>
				<li><a href="${path}/ShowJobControllerByUser">招聘</a></li>
				<li><a href="${path}/ShowNewsControllerByUser">新闻</a></li>
			</ul>
			<!--hide end -->
			<a href="javascript:void(0);" onclick="logout();"><img class="header_img"
				src="${path}/images/logout_w.png" /></a>
		</div>
		<div style="width: 40%; height: 47px; margin: 5px;">
			<img src="${path}/images/logo_w.png" />
		</div>

	</div>
	<!--Body-->
	<div style="width: 100%; height: 95%;; padding-top: 48px;">
		<div class="note_body center-block">

			<div class="sub_title">
				<img class="user_img" src="${path}/images/userimg.jpg"> <span
					class="sub_title_font">${sessionScope.user.username}的笔记中心</span>
			</div>


			<div
				style="width: 100%; border-bottom: #666 2px solid; height: 35px;">


				<div style="float: right; width: 60%; padding-bottom: 5px;">
					<form>
						<button type="submit" class="btn btn-default f_right">
							<i class="icon-search"></i>
						</button>
						<input type="text" class="form-control searchbox"
							placeholder="Search" style="width: 180px;" />
					</form>
				</div>
				<h2 style="color: #3280FC; padding-top: 5px;">笔记中心总览</h2>
			</div>
			<!--main middle body-->
			<div style="width: 100%; height: 400px;">

				<!-- left classify-->
				<div class="box_noteclas">
					<div class="note_clas">
						<a href="${path}/ShowBriefNoteController" style="color: #333">All
							Notebooks</a> <i class="icon-cogs f_right" style="font-size: 16px"></i>
						<i class="icon-plus f_right" style="font-size: 16px;"></i>
						<!--add classify hidden box-->
						<span class="add_bg" style="display: none"> <input
							type="text" id="addtxt"
							style="margin-left: 10px; margin-right: 10px; width: 130px; height: 20px;"><br>
							<button class="btn btn-mini btn-default f_right"
								id="btn_newclassfiy">新增分类</button></span>
						<!-- box end -->
					</div>

					<!-- sub classify read cycle 笔记本分类栏-->
					<c:forEach var="noteRepo" items="${list}">
						<div class="note_sclas">
							<input type="hidden" id="repoid4du" value="${noteRepo.repoId}" />
							<a href="${page.url}?repoId=${noteRepo.repoId}"><span
								id="clas_show">${noteRepo.repoName}</span></a>
							<!--hide notebook name for edit-->
							<span id="clas_edit_box"> <input type="text"
								placeholder="${noteRepo.repoName}" size="14" id="clas_edit_text" />
								<button class="icon-ok f_right" id="edit_repo"
									style="border: none; background: #FFF"></button>
							</span>
							<!--edit delete icon -->
							<i class="icon-edit f_right" id="clasicon_edit"
								style="display: none"></i> <i class="icon-trash f_right"
								id="clasicon_del" style="display: none"></i>
							<div class="clas_del_box" id="clas_del">
								<button class="btn btn-mini btn-default" id="btnclas_del">确认删除</button>
								<button class="btn btn-mini btn-default" id="btnclas_keep">保留</button>
							</div>
							<!--hidden end -->
						</div>
					</c:forEach>
				</div>

				<!--left end  right begin-->
				<div class="box_right">
					<div class="box_addnote">
						<a href="${path}/Supply4NewNoteController"><i
							class="icon-plus f_right btn_addnote"> 新建笔记</i></a>
					</div>
					<table class="note_table">
						<tr>
							<th width="70%" align="center">笔记标题</th>
							<th width="25%">建立日期</th>
							<th><i class="icon-cog f_right"></i></th>
						</tr>
						<c:forEach var="note" items="${page.list}">
							<tr>
								<td><input type="hidden" id="id4del" value="${note.id}" /><a
									href="${path}/ShowNoteBookViewController?id=${note.id}">${note.title}</a></td>
								<td>${note.time}</td>
								<td><i class="icon-trash f_right" id="clasicon_del"
									style="display: none"></i>
									<div class="clas_del_box" id="clas_del">
										<button class="btn btn-mini btn-default" id="btnclas_del">确认删除</button>
										<button class="btn btn-mini btn-default" id="btnclas_keep">保留</button>
									</div></td>
							</tr>
						</c:forEach>
					</table>
					<!--add pager here-->
					<jsp:include page="/jsp/user/upager.jsp"></jsp:include>
					<!-- pager End here -->
				</div>

			</div>
			<!--Body center div end blow-->
			<!--FOOT -->
			<div class="user_foot">Copyrights(C)1997-2014 求知无限有限公司 Thirsty
				for Knowledge Co.Ltd 版权所有 不得转载</div>
			<!--FOOT END-->

		</div>
	</div>
	<script type="text/javascript">
		$("#btn_newclassfiy").click(function() {
			var repoName = $("#addtxt").val();
			$.post("${path}/AddNoteRepoController", {
				//从session中取出user
				username : "${sessionScope.user.username}",
				repoName : repoName
			}, function(data) {
				alert(data);
				location.replace("${path}/ShowBriefNoteController");
			});
			$("span.add_bg").hide("fast");
		});

		$(".box_noteclas").find("#btnclas_del").click(function() {
			$(this).parent().fadeOut(300);
		});

		$(".note_table").find("button#btnclas_del").click(
				function() {
					//删除笔记
					var id = $(this).parent().parent().parent().find(
							"input#id4del").val();
					var p = $(this).parent().parent().parent();
					$.post("${path}/DeleteNoteController", {
						id : id
					}, function(data) {
						if (data == "删除成功") {
							alert(data);
							p.hide();
						} else {
							alert(data);
						}
					});
				});

		$(".box_noteclas").find("button#btnclas_del").click(function() {
			//删除笔记本
			var id = $(this).parent().parent().find("input#repoid4du").val();
			var p = $(this).parent().parent();
			$.post("${path}/DeleteNoteRepoController", {
				repoId : id
			}, function(data) {
				if (data == "删除成功") {
					alert(data);
					p.hide();
				} else {
					alert(data);
				}
			});
		});

		$(".box_noteclas").find("button#edit_repo").click(function() {
			//更新笔记本
			var id = $(this).parent().parent().find("input#repoid4du").val();
			var repoName = $(this).parent().parent().find("input#clas_edit_text").val();
			var p = $(this).parent().parent();
			$.post("${path}/UpdateNoteRepoController",{repoId:id,repoName:repoName},function(data){
				if(data=="更新成功"){
					alert(data);
					history.go(0);
				}else{
					alert(data);
				}
			});
		});
		
		//注销
		function logout() {
			$.post("/qiuzhi/LogoutController", function(data) {
				if (data == "1") {
					alert("注销成功");
					window.location.href = "/qiuzhi/index.html";
				}
			});
		}
	</script>
</body>
</html>
